<template>
  <div>
    <FormPanel ref="formPanel" :list="formList" :cols="1" :labelWidth="110" formType="add" :isSubmitBtn="false" @formChange="formChangeHandle" />
    <BaseDialog :visible.sync="showAddNew" title="金额明细" width="1000px" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <DetailTable ref="detailTable" @close="closeDialog" />
    </BaseDialog>
  </div>
</template>

<script>
import DetailTable from './detailTable';

export default {
  name: 'PriceStuff',
  components: {
    DetailTable
  },
  props: {
    fromData: {
      type: Object,
      required: true
    }
  },
  data() {
    return {
      formList: this.createFormList(),
      showAddNew: false,
      dialogData: []
    };
  },
  watch: {
    fromData: {
      handler(obj) {
        console.log(obj);
        for (let [key, value] of Object.entries(obj)) {
          this.formList.some(item => {
            if (item.fieldName === key) {
              item.initialValue = value;
              return true;
            }
          });
        }
        let arr = [];
        for (const item of obj.maintainPro) {
          if (!item.CHARGE_PARTITION_CODE) {
            arr.push(item);
          }
        }
        for (const item of obj.maintainMat) {
          if (!item.CHARGE_PARTITION_CODE) {
            arr.push(item);
          }
        }
        for (const item of obj.additional) {
          if (!item.CHARGE_PARTITION_CODE) {
            arr.push(item);
          }
        }
        this.dialogData = arr;
        console.log('table', this.dialogData);
      },

      deep: true
    }
  },
  methods: {
    createFormList() {
      return [
        {
          type: 'INPUT',
          label: '工时费',
          fieldName: 'labourAmount',
          disabled: true,
          numberFormat: true
          // rules: [{ required: true, message: '请输入附加项目名称', trigger: 'blur' }],
          // change: val => {
          //   this.changeNameSelect(val);
          // }
        },
        {
          type: 'INPUT',
          label: '维修材料费',
          fieldName: 'repairPartAmount',
          disabled: true,
          numberFormat: true
        },
        {
          type: 'INPUT',
          label: '销售材料费',
          fieldName: 'salePartAmount',
          disabled: true,
          numberFormat: true
        },
        {
          type: 'INPUT',
          label: '附加项目费',
          fieldName: 'addItemAmount',
          disabled: true,
          numberFormat: true
        },
        {
          type: 'INPUT',
          label: '维修金额',
          fieldName: 'totalAmount',
          // disabled: true,
          readonly: true,
          numberFormat: true,
          unitRender: () => {
            return <el-button icon="el-icon-search" onClick={() => this.detail()}></el-button>;
          }
        },
        {
          type: 'INPUT',
          label: '预估金额',
          fieldName: 'estimateAmount',
          disabled: true,
          numberFormat: true
        }
      ];
    },
    setData(data) {
      // for (const item of this.formList) {
      //   item.initialValue = data[item.fieldName]
      // }
    },
    formChangeHandle(val) {
      this.saveData = val;
    },
    detail() {
      this.showAddNew = true;
      console.log('detail');
      this.$nextTick(() => {
        this.$refs.detailTable.openModel(this.dialogData);
      });
    },
    closeDialog() {
      this.showAddNew = false;
    }
    // tableData(){
    //   let arr = []
    //   for (let [key, value] of Object.entries(this.fromData)) {
    //     if(value.length > 0) {
    //       for (const item of value) {
    //         if(!item.CHARGE_PARTITION_CODE){
    //           arr.push(item)
    //           return true
    //         }
    //       }
    //     }
    //   }
    //   this.dialogData = arr
    //   console.log('table',this.dialogData)
    // },
  }
};
</script>

<style lang="less"></style>
